<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        *{
            margin: 0;
            padding: 0;
        }
        body {
            background: url(./bg.jpeg) no-repeat;
        }
        .box {
            width: 500px;
            height: 500px;
            background-color: white;
            margin: 100px auto;
        }
        .top {
            height: 100px;
            background-color: pink;
            line-height: 100px;
            text-align: center;
            color: white;
        }
       .bottom .hezi {
        width: 80%;
        margin: 0 auto;
        margin-top: 30px;
       }
       .bottom .hezi:nth-child(1) {
        margin-top: 70px;
       }
       .bottom .hezi input {
        box-sizing: border-box;
        width: 100%;
        height: 40px;
        padding-left: 10px;
        border-radius: 5px;
        color: gainsboro;
        border: 1px solid gainsboro;
       }
       .anniu {
        width: 80%;
        margin: 30px auto;
        display: flex;
        justify-content: space-between;
       }
       .anniu button {
        border: none;
        width: 80px;
        height: 30px;
        text-align: left;
        line-height: 30px;
        background-color: white;
        color: gainsboro;
        font-size: 20px;
        cursor: pointer;
       }
       .denglu {
        margin: 0 auto;
        text-align: center;
       }
       button {
        width: 70px;
        height: 40px;
        line-height: 40px;
        text-align: center;
        background-color: green;
        border-radius: 5px;
        color: white;
        border: 1px solid gainsboro;
        cursor: pointer;
       }
    </style>
</head>
<body>
    <div class="box">
        <div class="top">
            <h2>欢迎登录后台管理系统</h2>
        </div>
        <div class="bottom">
            <div class="hezi"><input type="text" placeholder="输入用户名" class="em"></div>
            <div class="hezi"><input type="password" placeholder="输入密码"></div>
            <div class="anniu"><button>去注册</button><button>忘记密码</button></div>
            <div class="denglu"><button class="dl">登录</button></div>
        </div>
    </div>
</body>
</html>
<script src="./axios.min.js"></script>
<script src="login.js"></script>